<template>
<van-icon
color="#dada1f"
name="star"
v-if="value"
@click="onCollect"
:loading="isloading"
/>
<van-icon
color="#777"
name="star-o"
v-else
@click="onCollect"
:loading="isloading"
/>
</template>
<script>
import { addCollection, deleteCollection } from '@/api/article'
export default {
  props: {
    value: {
      type: Boolean,
      required: true
    },
    art_id: {
      type: [Number, String, Object],
      required: true
    }
  },
  data () {
    return {
      isloading: false
    }
  },
  methods: {
    async onCollect () {
      this.isloading = true
      try {
        if (this.value === true) {
          // console.log('取消收藏')
          await deleteCollection(this.art_id)
        } else {
          // console.log('添加收藏')
          await addCollection(this.art_id)
        }
        // this.$toast.success('操作收藏成功')
      } catch (err) {
        // this.$toast.fail('收藏操作失败')
      }
      this.$emit('input', !this.value)

      this.isloading = false
    }
  }
}
</script>
<style scoped lang="less">

</style>
